<script setup lang="ts">
import {Search} from '@vicons/tabler'
import {ZoomReset} from '@vicons/carbon'
const emits = defineEmits(["onSearch", "onReset"]);

const handleSubmitSearch = () => {
  emits("onSearch");
}

const resetData = () => {
  emits("onReset");
}
</script>

<template>
  <n-card style="margin-bottom: 6px">
    <n-form
        @keydown.enter.prevent="handleSubmitSearch"
        inline
        :show-feedback="false"
        class="search-card"
        label-placement="left">
      <slot name="default"></slot>
      <n-form-item>
        <div style="display: flex;gap: 8px;">
          <n-button type="primary" @click="handleSubmitSearch">
            <template #icon>
              <Search/>
            </template>
            查询</n-button>
          <n-button @click="resetData">
            <template #icon>
              <ZoomReset />
            </template>
            重置
          </n-button>
        </div>
      </n-form-item>
    </n-form>
  </n-card>
</template>
<style  lang="scss">
.search-card {
  .n-form-item:nth-last-child(2) {
    margin-right: 10px !important;
  }
}
</style>